/**
 * Created by python on 18-11-14.
 */
let app = new Vue({
    el: '#app',
    data: {
        host: 'http://127.0.0.1:8000/headline/',
        host2: 'http://127.0.0.1:8000',
        username: sessionStorage.username || localStorage.username,
        user_id: sessionStorage.user_id || localStorage.user_id,
        token: sessionStorage.token || localStorage.token,
        categories:[], //新闻专栏
        avatar: '',
        title: '',
        category_id: '',
        label_id: [],
        content: '',
    },
    created: function () {
        Vue.nextTick(function () {
            CKEDITOR.replace('editor1');
               });
    },
    mounted: function(){
        // 获取分类
        this.get_category();
        // 判断用户的登录状态
        if (this.user_id && this.token) {
            axios.get(this.host2 + '/user/information/', {
                    // 向后端传递JWT token的方法
                    headers: {
                        'Authorization': 'JWT ' + this.token
                    },
                    responseType: 'json',
                })
                .then(response => {
                    // 加载用户数据
                    this.user_id = response.data.id;
                    this.username = response.data.username;
                    this.avatar = response.data.avatar;
                })
                .catch(error => {
                    if (error.response.status==401 || error.response.status==403) {
                        location.href = '/login.html?next=/headline-column.html';
                    }
                });
        } else {
            location.href = '/login.html?next=/headline-column.html';
        };
    },
    methods: {
        // 表单提交
        on_submit: function(){
            axios.post(this.host+'news/', {
                    title: this.title,
                    category_id: this.category_id,
                    label_id: this.label_id,
                    content: CKEDITOR.instances.editor1.getData(),
                }, {
                    headers: {
                    'Authorization': 'JWT ' + this.token
                    },
                    responseType: 'json',
                    withCredentials: true
                })
                .then(response => {
                    console.log(response);
                    alert('创建成功')
                    location.href = '/headline-login.html';
                })
                .catch(error => {
                    if (error.response.status == 401) {
                            console.log('请登录后操作误');
                        } else {
                            console.log(error);;
                        }
                })
        },
        // 请求专栏数据
        get_category: function () {
            // http://127.0.0.1:8000/headline/categories/
            axios.get(this.host+'categories/')
                .then(response =>{
                    this.categories = response.data
                    this.categories.splice(0,1)
                })
                .catch(error =>{
                    console.log(error.response.data);
                })
        },
        select_category: function (category) {
            this.category_id = category.id
        },
        select_label: function (value) {
            this.label_id.push(value)
        },
        remove_label: function (value) {
            this.label_id.splice(this.label_id.indexOf(value), 1);
        }
    },
});